<?php $pet_name = !$this->error_pet ? ucfirst($this->attributes['name']->getAttributeEntity()->getValue()) : $this->translate->_("Pet does not exist."); ?>
<!DOCTYPE html>
<html>
	<head>
		<meta name="HandheldFriendly" content="true" />
		<meta name="MobileOptimized" content="width" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title><?php echo $pet_name; ?></title>
		<style>
			html, body  {
				padding: 0px;
				margin: 0px;
			}

			body {
				font-family: Helvetica,Arial,sans-serif;
				font-size: 12px;
				line-height: 16px;
				background: #edf3e3 url('/images/mobile_bg.png') top left repeat-x;
			}

			div.page > h1 {
				color: #047E00;
				margin: 20px 0px 0px 0px;
				padding: 0px;
				font-size: 16px;
				text-align: center;
			}

			b.error {
				display: block;
				text-align: center;
				color: red;
				margin: 0px 15px 15px 0px;
			}

			b.error_smaller {
				display: block;
				text-align: center;
				color: red;
				margin: 15px;
			}

			.clear {
				clear: both;
			}

			div.page {
				width: 320px;
				margin: 0 auto;
				background: transparent url('/images/logo.png') top center no-repeat;
				padding-top: 83px;
				margin-top: 10px;
			}

				div.page > table {
					width: 100%;
					border-spacing: 0;
					border-collapse: collapse;
				}

					div.page > table th {
						text-align: right;
						white-space: nowrap;
						vertical-align: top;
						padding: 4px 10px 4px 4px;
						border-right: 1px dashed #a5cc7d;
						width: 50%;
					}

					div.page > table td {
						padding: 4px 4px 4px 10px;
					}

			div.green_box {
				border: 1px solid #a5cc7d;
			}

				div.green_box > div.title {
					border-bottom: 1px solid #a5cc7d;
				}

					div.green_box > div.title > span {
						display: block;
						width: 106px;
						float: left;
						text-align: center;
					}

						div.green_box > div.title > span > span {
							display: block;
							background: #ddeec9;
							padding: 6px;
							color: #244700;
							cursor: pointer;
							border-right: 1px solid #a5cc7d;
						}

						div.green_box > div.title > span > span.last {
							border-right: none;
						}

						div.green_box > div.title > span > span.active {
							background: #bbe293;
							font-weight: bold;
						}

				div.green_box > div.tab_pics {
					padding: 15px 0px 0px 15px;
				}

				div.green_box > div.tab_desc {
					margin: 10px;
				}

				div.green_box > div.tab_desc > p {
					margin: 0px;
					padding: 0px;
				}

			a.thumb {
				float: left;
				margin-right: 15px;
				margin-bottom: 15px;
				position: relative;
			}

			a.thumb > img {
				display: block;
				padding: 3px;
				border: 1px solid #a5cc7d;
				background: white;
				width: 128px;
			}

			a.thumb > span {
				display: block;
				position: absolute;
				bottom: 6px;
				right: 6px;
				padding: 0 4px;
				border-radius: 3px;
				background: #000;
				font-weight: bold;
				color: #fff;
				opacity: 0.75;
				font-size: 10px;
			}

			div.footer {
				text-align: center;
				color: #7b985e;
				background: #bbe293;
				border-top: 1px solid #a5cc7d;
				padding: 4px;
				font-size: 11px;
			}
		</style>
	</head>
	<body>
		<div class="page">
			<?php if($this->flagged): ?>
				<h1><?php echo $pet_name; ?></h1>
				<b class="error_smaller"><?php echo $this->translate->_("Cannot display this pet because it was flagged by the community."); ?></b>
				<ul>
					<?php foreach(array_unique($this->flagged) as $item): ?>
						<li><?php echo $item; ?></li>
					<?php endforeach; ?>
				</ul>
			<?php elseif($this->error_pet): ?>
				<h1><?php echo $this->translate->_("Pet does not exist."); ?></h1>
				<br />
			<?php else: ?>
				<table>
					<tr><th></th><td></td></tr>
					<tr><th></th><td></td></tr>
					<tr>
						<th><?php echo $this->translate->_("Name") ?></th>
				 		<td><?php echo $pet_name; ?></td>
				 	</tr>
					<tr>
						<th><?php echo $this->translate->_("Owner") ?></th>
				 		<td><?php echo $this->owner->getName(); ?></td>
				 	</tr>
					<tr>
						<th><?php echo $this->translate->_("Species") ?></th>
				 		<td><?php echo $this->species[$this->pet->getAttributeSetId()]; ?></td>
				 	</tr>
				    <?php $description = array(); $sci = false;
				    	foreach ($this->attributes as $attr) {
				    		$src = is_array($attr->getAttributeEntity()) ? reset($attr->getAttributeEntity()) : $attr->getAttributeEntity();
							$val = $src->getValue();

							// skip name
							if(strpos($attr->getCode(), '_name') !== false)
								continue;

							// skip description
							if(strpos($attr->getCode(), '_description') !== false) {
								$description = array($this->Tr($attr->getLabel()), $val);
								continue;
							}

							// has value?
							if (isset($val) && strlen($val) > 0) {
								echo "<tr><th>";
				        		echo $this->Tr($attr->getLabel());
				        		echo "</th><td>";

				        		echo $val;

				        		// no description for the price fields
				        		if ($attr->getDescription() && strlen($attr->getDescription()) > 0 && !($attr->getCurrencyId() && intval($attr->getCurrencyId()) > 0))
				        			echo "&nbsp;".$attr->getDescription();

				        		echo "</td></tr>";
							}

				        	// show the latin name if it's any
				        	if ($attr->getAttributeInputType()->getType() == 'select')
				        		if ($src->getLatin() && strlen($src->getLatin()) > 0)
				        			$sci = $src->getLatin();
						}
					if($sci): ?>
						<tr>
							<th><?php echo $this->translate->_("Scientific name") ?></th>
					 		<td><?php echo $sci; ?></td>
					 	</tr>
					<?php endif; if($this->pet->getMobileEmergency() == '1'): ?>
						<tr><th></th><td></td></tr>
						<tr><th></th><td></td></tr>
						<?php foreach($this->pet_emergency_contacts as $idx => $one): $idx++; ?>
							<tr>
								<th><?php echo $this->translate->_('Emergency Contact') . ' #' . $idx; ?></th>
								<td>
									<?php echo $one->getFirstName(). ' ' . $one->getLastName(); ?><br />
									<?php echo $this->service_types[$one->getCategory()]; ?><br />
									<?php echo $one->getEmail(); ?><br />
									<?php echo $one->getPhone(); ?>
								</td>
							</tr>
						<?php endforeach; ?>
					<?php endif; ?>
					<tr><th></th><td></td></tr>
					<tr><th></th><td></td></tr>
				</table>
				<div class="green_box">
					<div class="title">
						<span data-id='pictures'><span class="active"><?php echo $this->translate->_("Pictures"); ?></span></span>
						<span data-id='videos'><span><?php echo $this->translate->_("Videos"); ?></span></span>
						<span data-id='info'><span class="last"><?php echo $this->translate->_("Description"); ?></span></span>
						<div class="clear"></div>
					</div>
					<div id="pictures" class="tab_pics">
						<?php if(count($this->gallery) > 0): ?>
							<?php foreach($this->gallery as $idx => $pic): ?>
								<a href="/images/userfiles/pets/<?php echo $this->pet->getId(); ?>/gallery/<?php echo $pic; ?>" class="thumb">
									<img src="/images/userfiles/pets/<?php echo $this->pet->getId(); ?>/gallery/small_<?php echo $pic; ?>" alt="<?php echo $idx; ?>" />
								</a>
							<?php endforeach; ?>
						<?php else: ?>
							<b class="error"><?php echo $this->translate->_("Sorry, nothing here pal :("); ?></b>
						<?php endif; ?>
						<div class="clear"></div>
					</div>
					<div id="videos" class="tab_pics" style="display: none;">
						<?php if(count($this->videos) > 0): ?>
							<?php foreach($this->videos as $idx => $video): ?>
								<?php
									// get video entity
									$entity = $video->getMapper();

									// get video thumbnail
									$thumbs = $entity->getVideoThumbnails();
									$thumbnail = $thumbs[1]['url'];

									// get video duration
									$duration = date("i:s", $entity->getVideoDuration());
								?>
								<a href="http://www.youtube.com/embed/<?php echo $entity->getVideoId(); ?>" class="thumb">
									<img src="<?php echo $thumbnail; ?>" alt="<?php echo $idx; ?>" />
									<span><?php echo $duration; ?></span>
								</a>
							<?php endforeach; ?>
						<?php else: ?>
							<b class="error"><?php echo $this->translate->_("Sorry, nothing here pal :("); ?></b>
						<?php endif; ?>
						<div class="clear"></div>
					</div>
					<div id="info" class="tab_desc" style="display: none;">
						<?php if(strlen($description[1]) > 0): ?>
							<?php echo $description[1]; ?>
						<?php else: ?>
							<b class="error_smaller"><?php echo $this->translate->_("Sorry, nothing here pal :("); ?></b>
						<?php endif; ?>
					</div>
				</div>
				<table>
					<tr><th></th><td></td></tr>
					<tr><th></th><td></td></tr>
					<tr><th></th><td></td></tr>
					<tr><th></th><td></td></tr>
				</table>
			<?php endif; ?>
		</div>
		<div class="footer"><?php printf($this->translate->_("Copyright &copy; %s Petolio AG. All rights reserved"), date('Y')); ?>.</div>
		<script type="text/javascript" src="/js/jquery/jquery-1.6.2.min.js"></script>
		<script type="text/javascript">
			var GreenBox = function() {
				var _switch = function(i, e) {
					$('.green_box > .title > span > span').removeClass('active');
					$('.green_box > #info').hide();
					$('.green_box > #pictures').hide();
					$('.green_box > #videos').hide();

					e.find('span').addClass('active');
					$('#' + i).show();
				}, _bind = function() {
					$('.green_box > .title > span').each(function(k, v) {
						var e = $(v),
							i = e.data('id');
						e.click(function(f){
							_switch(i, e);
						});
					});
				}, __construct = function() {
					_bind();
				};

				return {
					init: __construct
				};
			}();

			$(GreenBox.init);
		</script>
	</body>
</html>